<template>
    <el-table :data="arr.length===0?list:arr" tooltip-effect="dark" style="width: 100%"
        @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55">
        </el-table-column>
        <el-table-column prop="books" label="课程" width="180">
        </el-table-column>
        <el-table-column label="讲师" width="180">
            <template slot-scope="scope">
                <div slot="reference" class="name-wrapper">
                    <span size="medium">{{ scope.row.teacher }}</span>
                </div>
            </template>
        </el-table-column>
        <el-table-column label="日期" width="180">
            <template slot-scope="scope">
                <i class="el-icon-time"></i>
                <span style="margin-left: 10px">{{ scope.row.time }}</span>
            </template>
        </el-table-column>
        <el-table-column prop="address" label="上课地址">
        </el-table-column>
        <el-table-column prop="numbers" label="听课人数" width="120">
        </el-table-column>
        <el-table-column prop="price" label="课程价格" width="120">
        </el-table-column>
        <el-table-column label="操作">
            <template slot-scope="scope">
                <el-button size="mini" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
                <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row.id)">删除</el-button>
            </template>
        </el-table-column>
    </el-table>
</template>

<script>
    import {
        chenqdelbyids,
        chenqdelbyid
    } from "../../../api/interface.js"
    import evevtBus from '@/untial/evevtBus';
    export default {
        props: ['list', 'arr'],
        data() {
            return {
                multipleSelection: [],
            }
        },
        created() {
            evevtBus.$on("delbyids", () => {
                chenqdelbyids({
                    ids: this.multipleSelection.map((ele) => ele.id)
                }).then(res => {
                    if (res.code == 200) {
                        this.$emit("refrsh", res.data)   
                    }
                });
            });
        },
        methods: {
            handleEdit(index, row) {
                this.$emit("updatevisual",row);
            },
            handleDelete(index, row) {
                chenqdelbyid({
                    id: row
                }).then(res => {
                    if (res.code == 200) {
                        this.$emit("refrsh", res.data)
                    }
                })
            },
            handleSelectionChange(val) {
                this.multipleSelection = val;
            }
        },
        watch: {}
    }
</script>

<style scoped>

</style>